<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>车神-黄杰-车神园</title>
    <link rel="stylesheet" href="../../../css/com/com.css">
    <link rel="stylesheet" href="../../../css/person_blog/defalutreader.css">

    <script src="../../../js/jq/template-web.js"></script>
    <script src="../../../js/jq/jquery-1.10.1.js"></script>
    <script src="../../../js/person_blog/defalutReader.js"></script>
</head>
<body>
    <div id="wrap">
        <!-- 头部 -->
        <div id="header"></div>

        <div id="main">
            <div class="mainContent clearFix">
                <div id="main-left">
                    <!-- 三部分 上 中下 -->
                    <!-- 文章内容 -->
                    <div class="main-top">
                        <h2>这里是文章显示</h2>
                        <div class="write-opa">
                            <!-- 四部分(博文信息操作灯)
                                分类
                                博文操作
                                上、下一篇
                                版权
                            -->
                            <!-- 分类 -->
                            <div class="write-type">
                                <div>
                                    <span>分类: </span>
                                    <a href="">vuex</a>
                                </div>
                                <div>
                                    <span>上一篇: </span>
                                    <a href="">vuex之getter(二)</a>
                                </div>
                                <div>
                                    <span>下一篇: </span>
                                    <a href="">mint ui的tabBar监听路由变化实现tabBar切换</a>
                                </div>
                                
                            </div>
                            <!-- 博文操作 -->
                            <div class="write-opa-list clearFix">
                                <div class="left">
                                    <a href="" id="concern-me" class="color">关注我</a>
                                    <a href="" id="collect" class="color">收藏博文</a>
                                    <a href=""><img src="../../imgs/weibo.png"></a>
                                    <a href=""><img src="../../imgs/weixin.png"></a>
                                    <a href=""><img src="../../imgs/QQ.png"></a>
                                </div>
                                <div class="right clearFix">
                                    <a href="">
                                        <img src="../../imgs/like.png">
                                        <span>(1)</span>
                                    </a>
                                    <a href="">
                                        <img src="../../imgs/jubao.png">
                                        <span>(2)</span>
                                    </a>
                                </div>
                            </div>
                        </div>
                    </div>
                    <!-- 评论 -->
                    <div class="main-center">
                        <div class="show-title clearFix">
                            <h3 class="title-text">评论区</h3>
                            <img src="../../imgs/more-img.png" alt="">
                        </div>
                        <div class="show-content">
                            <!-- 评论的发表 -->
                            <div class="send-commit">
                                    <div class="send-top clearFix">
                                        <!-- 添加代码块 -->
                                        <div href="javascript:;" class="add-code more">
                                            <a href="javascript:;" class="code-text clearFix">
                                                <div>添加代码块</div>
                                                <img class="more-img" src="../../imgs/more-img.png" alt="">
                                            </a>
                                            <div class="add-list">
                                                <ul>
                                                    <li><a href="">javascript</a></li>
                                                    <li><a href="">html</a></li>
                                                    <li><a href="">css</a></li>
                                                    <li><a href="">node</a></li>
                                                    <li><a href="">java</a></li>
                                                    <li><a href="">c++</a></li>
                                                    <li><a href="">Python</a></li>
                                                    <li><a href="">go</a></li>
                                                    <li><a href="">易语言</a></li>
                                                    <li><a href="">其他</a></li>
                                                </ul>
                                            </div>
                                        
                                        </div>
                                    </div>
                                    <div class="send-center">
                                        <input placeholder="输入您的评论">
                                        <textarea placeholder="请文明评论，不得发表关于政治、色情等评论内容，否则后果自负" class="commit-comtent"></textarea>
                                    </div>
                                    <div class="send-bottom clearFix">
                                        <div class="send-btn">
                                            <span>
                                                还能输入
                                                <span>1000</span>
                                                个字
                                            </span>
                                            <a href="">取消回复</a>
                                            <a href="">发表评论</a>
                                        </div>
                                    </div>
                            </div>
                            <!-- 评论展示区 -->
                            <div class="show-commit">
                                
                                <div class="show-list">
                                    <ul>
                                        <li>
                                            <!-- 评论内容 -->
                                            <div class="commit-content">
                                                <!-- 也分为三部分 
                                                    楼主信息
                                                    评论内容
                                                    用户操作 回复 点赞 举报等
                                                -->
                                                <!-- 博主信息 -->
                                                <div class="commit-top clearFix">
                                                    <a href="">
                                                        <img src="../../imgs/int.jpg">
                                                        <p>车神-黄杰:</p>
                                                    </a>
                                                    <div class="time-info">
                                                        <span id="position">1楼</span>
                                                        <span>&lt;---&gt;</span>
                                                        <span id="time">1天前</span>
                                                    </div>
                                                </div>
                                                <!-- 评论内容 -->
                                                <div class="commit-center">
                                                    但是，大神啊！我的电脑型号和你一样都是联想小新win10，但，
                                                    我用您的方法安装完后，windows系统不见了，就只剩Ubuntu了。
                                                    但是，大神啊！我的电脑型号和你一样都是联想小新win10，但，
                                                    我用您的方法安装完后，windows系统不见了，就只剩Ubuntu了。
                                                </div>
                                                <!-- 用户操作 -->
                                                <div class="commit-bottom clearFix">
                                                    <div class="opa-list-b clearFix">
                                                        <a href=""><img src="../../imgs/huifu.png" title="回复"></a>
                                                        <a href=""><img src="../../imgs/jubao.png" title="举报"></a>
                                                        <a href=""><img src="../../imgs/like.png" title="点赞"></a>
                                                    </div>
                                                </div>
                                            </div>
                                            <!-- 回复列表 -->
                                            <ul>
                                                <li>
                                                    <!-- 头像 谁回复谁 -->
                                                    <div class="reply-top clearFix">
                                                        <a href="">
                                                            <img src="../../imgs/int.jpg">
                                                            <p>车神-黄杰</p>
                                                        </a>
                                                        <p>回复</p>
                                                        <a href="">
                                                            <img src="../../imgs/int.jpg">
                                                            <p>战胜:</p>
                                                        </a>
                                                        <p class="reply-time">(1天前)</p>
                                                    </div>
                                                    <div class="reply-center">
                                                        但是，大神啊！我的电脑型号和你一样都是联想小新win10，但，
                                                        我用您的方法安装完后，windows系统不见了，就只剩Ubuntu了。
                                                        但是，大神啊！我的电脑型号和你一样都是联想小新win10，但，
                                                        我用您的方法安装完后，windows系统不见了，就只剩Ubuntu了。
                                                    </div>
                                                    <div class="reply-bottom clearFix">
                                                        <div class="reply-opa-list clearFix">
                                                            <a href=""><img src="../../imgs/huifu.png" title="回复"></a>
                                                            <a href=""><img src="../../imgs/jubao.png" title="举报"></a>
                                                            <a href=""><img src="../../imgs/like.png" title="点赞"></a>
                                                        </div>
                                                    </div>
                                                </li>
                                            </ul>
                                        </li>
                                    </ul>
                                </div>
                            </div>
                            <!-- 空的div 目的为了让最底下有留白 -->
                            <div style="height: 30px"></div>
                        </div>
                    </div>
                    <!-- 推荐 -->
                    <div class="main-bottom">
                        <!-- 这里是推荐 -->
                        <div class="show-title clearFix">
                            <h3 class="title-text">推荐区</h3>
                            <img src="../../imgs/more-img.png" alt="">
                        </div>
                        <div class="recommend-blog">
                            <a href="">
                                <div class="blog-content">
                                    <div class="blog-title clearFix">
                                        <p>Git 实用操作手册 - GitChat - 车神园博客</p>
                                        <p class="blog-reader-num">阅读量2000</p>
                                    </div>
                                    <div class="blog-dsec">
                                        <p title="Git 实用操作手册" class="single-text">
                                            首先声明一下该篇 Chat 适合了解并使用过 Git 的同学,之前我在 
                                            GithChat 上...对不起老板,我的脑子里真的只有Bug!!! 基于RabbitMQ 
                                            的消息平台入门与实战  个门与实战  个
                                        </p>
                                    </div>
                                </div>
                            </a>
                        </div>
                        <!-- 空的div 目的为了让最底下有留白 -->
                        <div style="height: 30px"></div>
                    </div>
                </div>
                <!-- 右侧Bar -->
                <div id="main-right"></div>
            </div>
        </div>
         <!-- 底部 还没做 -->
         <div id="footer"></div>
    </div>
</body>
</html>